import React,{useState} from "react"
import {List} from "antd-mobile"
import Link from 'umi/link';
import ComponentProps from "./component-props"
import ComponentProps2 from "./component-props2"
const Item = List.Item;
const Component = ()=>{
  const [name,setName] = useState("传值")
  const [num,setNum] = useState(null)
  const handleGetName = (data)=>{
    alert(data)
  }
  const handleProps2Num = (data)=>{
    setNum(data)
  }
  return (
    <>
      <List header='基础用法'>
        <Item>
          <Link to="/class/component-1">Go to list page</Link>
        </Item>
        <Item>
          <Link to="/class/component-2">Go to list page2</Link>
        </Item>
        <Item>
          <Link to="/class/dav">Go to dav</Link>
        </Item>
        <Item>
          <Link to="/class/context">Go to context</Link>
        </Item>
        <Item>
          <Link to="/class/modle">Go to modle</Link>
        </Item>
        <Item>
          <Link to="/class/ref">Go to ref</Link>
        </Item>
        <Item>
          <Link to="/class/function">Go to function</Link>
        </Item>
      </List>
      <ComponentProps  handleName={handleGetName} name={name} num={num}></ComponentProps>
      <ComponentProps2 handleNum={handleProps2Num}></ComponentProps2>

    </>
  )
}
export default Component